<template>
  <div>
    <h1>你要购买的商品数量: {{count}}</h1>
    <button @click="count+=1">点击添加1</button>
    <button @click="addFn">点击添加1</button>
    <button @click="subFn">点击减少1</button>
    <!-- 这是函数调用实参 -->
    <button @click="addCountFn(10)">一次性来10个</button>
  </div>
</template>

<script>
export default {
  // data 放数据的
  data() {
    return {
      count: 0,
    };
  },
  // methods 写函数/方法的
  methods: {
    addFn() {
      // 💥注意，如果在 js 中要访问到data的数据，需要写成 this.xxx
      this.count++;
    },
    subFn() {
      this.count--;
    },
    // 函数定义的时候是形参
    addCountFn(number) {
      this.count += number;
    },
  },
};
</script>

<style>
</style>